<template>
  <div>
    <h1>{{ num }}</h1>
    <h1>{{ str }}</h1>
    <h1>{{ evenOrOdd }}</h1>
    <button @click="add">add1</button>
    <button @click="jian">减1</button>
    <button @click="oddAdd">如果是奇数+1</button>
  </div>
</template>

<script>
import { mapState, mapGetters, mapMutations, mapActions } from "vuex";
export default {
  mounted() {
    console.log(this.$store);
    console.log(this.$store.state.num);
  },
  data() {
    return {
      count: 0,
    };
  },
  //   在computed中可以调用state和getters当中的值进行处理
  computed: {
    ...mapState(["num", "str"]),
    ...mapGetters(["evenOrOdd"]),
  },
  methods: {
    ...mapMutations(["add", "jian"]),
    ...mapActions(["oddAdd"]),
  },
};
</script>

<style lang="scss" scoped>
</style>